<div>
    <ul class="level1">
        <template v-for="(quotePart,key1) in quoteProductInfo.quotePartsList">
            <li class="product" :clsid="quotePart.constructId">
                <ul v-if="quotePart.mustChoice" class="product-buy-ul level2" :noneId="quotePart.constructId">
                    <li>
                        <label >{{quotePart.name}}</label>
                        <template v-for="(attr,key2) in quotePart.quoteAttributeList">
                            <!--隐藏的必选属性-->
                            <div   v-if="(attr.attributeDisplay == false && attr.mustChioce == true)" style="display: none;">
                                    <i>{{attr.name}}:</i>
                                    <el-select  size="mini">
                                        <el-option v-for="option  in attr.quoteAttributeOptionList" :value="option.id" :label="option.name"></el-option>
                                    </el-select>
                            </div>
                            <div   v-if="(attr.attributeType == 'normal') || (attr.attributeType == 'craft' && attr.attributeDisplay == true )">
                                <el-row :gutter="15">
                                <el-col :span="1" >
                                    <div class="control-label" style="text-align:center;">{{attr.name}}:</div>
                                </el-col>
                                <el-col :span="2">
                                    <div >
                                        <!-- 绑定一个有属性的对象 -->
                                        <div v-bind="cc = quotePart.constructId"></div>
                                        <div v-bind="cc = 'a'+cc"></div>
                                        <div>{{cc}}</div>
                                        <el-select  size="mini"  placeholder="请选择" v-model="caculateQuotePriceData[cc]">
                                            <el-option
                                                    v-for="option in attr.quoteAttributeOptionList"
                                                    :key="option.value"
                                                    :label="option.name"
                                                    :value="option.id">
                                            </el-option>
                                        </el-select>
                                    </div>
                                </el-col>
                                    <!--如可自定义，则显示一个自定义选项框-->
                                <el-col :span="1">
                                    <div v-if="attr.canDefinition">
                                        <el-checkbox >自定义</el-checkbox>
                                    </div>
                                </el-col>

                                </el-row>
                            </div>



                            <div   v-if="(attr.attributeType == 'material')" >
                                <el-row :gutter="15">
                                    <el-col :span="1" >
                                        <div class="control-label" style="text-align:center;">{{attr.name}}:</div>
                                    </el-col>
                                    <el-col :span="2">
                                        <div >
                                            <el-select  size="mini"  placeholder="请选择">
                                                <el-option
                                                        v-for="option in attr.quoteAttributeOptionList"
                                                        :key="option.value"
                                                        :label="option.name"
                                                        :value="option.id">
                                                </el-option>
                                            </el-select>
                                        </div>
                                    </el-col>

                                    <el-col :span="2">
                                        <div >
                                            <el-select  size="mini"  placeholder="请选择">
                                                <el-option
                                                        v-for="option in attr.quoteAttributeOptionList"
                                                        :key="option.value"
                                                        :label="option.name"
                                                        :value="option.id">
                                                </el-option>
                                            </el-select>
                                        </div>
                                    </el-col>
                                </el-row>
                            </div>
                        </template>


                         <template v-for="attr in quotePart.quoteAttributeList">
                             <span v-if="attr.attributeType == 'craft' && attr.mustChioce!= true" hidden>{{craftNum=true}}</span>
                         </template>


                        <div v-if="craftNum">
                            <el-row :gutter="15">
                                <el-col :span="1" >
                                    <div class="control-label" style="text-align:center;"><el-checkbox >添加工艺</el-checkbox></div>
                                </el-col>
                            </el-row >
                        </div>


                        <div class="product-list-can" >
                              <template v-for="attr in quotePart.quoteAttributeList">
                                  <template v-if="attr.attributeType == 'craft' && attr.mustChioce != true">
                                        <el-row :gutter="15">
                                            <el-col :span="2">
                                            <el-checkbox >{{attr.name}}</el-checkbox>
                                            </el-col>
                                            <el-col :span="2">
                                            <template >
                                                <el-select size="mini">
                                                    <el-option
                                                            v-for="opt in attr.quoteAttributeOptionList"
                                                            :key="opt.value"
                                                            :label="opt.name"
                                                            :value="opt.id">
                                                    </el-option>
                                                </el-select>
                                            </template>
                                            </el-col>
                                            <el-col :span="5">
                                            <template v-if="attr.canDefinition">
                                                <el-input size="mini" style="width:100px" ></el-input><img src="https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/pop%2Fmall%2Fimage%2Fzy_img_04.png"><el-input size="mini" style="width:100px" ></el-input>
                                            </template>
                                            </el-col>
                                        </el-row>
                                  </template>
                              </template>
                        </div>
                    </li>
                </ul>
            </li>
        </template>
    </ul>
    <el-row>
        <template v-for="quotePart in  quoteProductInfo.quotePartsList">
            <el-checkbox  v-if="!quotePart.mustChoice">{{quotePart.name}}</el-checkbox>
        </template>
    </el-row>
    <el-row>
    <el-button class="primary" size="small" @click="caculateQuotePrice">算价</el-button>
    </el-row>
</div>
